<template>
  <!-- 头部标题栏 -->
    <header class="header-nav-bar-box">
        <van-nav-bar :left-arrow="back" :border="false" @click-left="handleClickLeft">
          <template #title>
            <div class="header-title-center">{{  title  }}</div>
          </template>
          <template #right>
            <div class="header-sub-btn">
                <slot name="right"></slot>
            </div>
          </template>
        </van-nav-bar>
    </header>
</template>
<script setup>
import {  getCurrentInstance } from 'vue';
import { useRouter } from 'vue-router';
const props = defineProps({
    title:{
        type: String,
        default: ''
    },
    back:{
        type: Boolean,
        default: false
    },
    onClickLeft:{
        type: Function,
        default: null
    }
})
const router = useRouter()
const handleClickLeft = () => {
  if (props.onClickLeft) {
    props.onClickLeft()
  } else {
    if (!window.history.state || window.history.length <= 1) {
      router.replace({ path: '/' })
    } else {
      router.back()
    }
  }
}
</script>
<style lang="scss" scoped></style>